<template>
	<view class="pages-box rel">
		<!-- #ifndef H5 -->
		<uni-nav-bar :fixed="true" :shadow="false" :statusBar="true" title="功能设置" leftIcon="icon-left"
			color="#ffffff" :backgroundColor="primaryColor">
		</uni-nav-bar>
		<view :style="{height:`${configInfo.navBarHeight}px`}"></view>
		<!-- #endif -->
		
		<view class="radius-20 fill-base use-box pt-sm pb-sm pl-lg pr-lg">
			<view class="h-110 flex-between " :class="[{'b-1px-b':index != useList.length - 1}]" 
			v-for="(item,index) in useList" :key="index" @tap="useChange(index)">
				<text class="f-ms-title text-bold">{{item.title}}</text>
				<i class="iconfont icon-right text-bold" style="color: #C7C7C7;font-size: 13px;"></i>
			</view>
		</view>
		<view class="h-100 out-btn f-ms-title text-bold radius-20 flex-center c-base" @tap="loginOut"
		:style="{background: primaryColor}">退出登录</view>
		<view class="space-footer"></view>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from "vuex"
	import siteInfo from '@/siteinfo.js';
	import tabbar from "@/components/tabbar.vue"
	
	export default {
		components: {
			tabbar
		},
		data() {
			return {
				useList: [
					{id: 1,title: '用户协议',link: 'information', openType: 'web'}, // /user/pages/agreement?type=service_agreement
					{id: 2,title: '隐私政策',link: 'protocol', openType: 'web'}, // /user/pages/agreement?type=privacy_agreement 
					{id: 3,title: '关于我们',link: 'about', openType: 'web'}, // /user/pages/about-us
					// {id: 4,title: '修改密码',link: '/user/pages/modify-pw'},
				]
			}
		},
		computed: mapState({
			primaryColor: state => state.config.configInfo.primaryColor,
			subColor: state => state.config.configInfo.subColor,
			configInfo: state => state.config.configInfo
		}),
		async onLoad(options) {
			this.initIndex()
		},
		async onShow() {},
		async onReachBottom() {},
		methods: {
			...mapActions(['getConfigInfo']),
			...mapMutations(['updateConfigItem', 'updateUserItem']),
			async initIndex(refresh = false){
				if(!this.configInfo.id || refresh){
					this.getConfigInfo()
				}
			},
			useChange(index){
				let {
					link = '',
					openType = "navigateTo"
				} = this.useList[index]
				let {
					siteroot
				} = siteInfo
				let href = siteroot.split('index.php')[0]
				if(openType == 'web'){
					link = `${href}${link}.html`
				}
				
				if(link){
					this.$util.goUrl({url: link, openType})
				}
			},
			async loginOut(){
				await this.$api.user.loginOut()
				this.updateUserItem({
					key: 'isAppLogin',
					val: false
				})
				this.updateUserItem({
					key: 'userInfo',
					val: {}
				})
				this.updateUserItem({
					key: 'coachInfo',
					val: {}
				})
				
				this.updateUserItem({
					key: 'autograph',
					val: ''
				})
				this.$util.showToast({
					title: '退出成功'
				})
				setTimeout(()=>{
					this.$util.goUrl({url: '/login/pages/index', openType: 'reLaunch'})
				},1000)
			}
		},
	}
</script>


<style lang="scss">
	.pages-box {
		.use-box{
			margin: 20rpx 25rpx;
		}
		.out-btn{
			margin: 20rpx 25rpx 0 25rpx;
		}
	}
</style>
